<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{common/public::common-public}">
    <meta charset="UTF-8">
    <title>管理员主界面</title>
</head>
<body>
    <style>
        .addLesson {
        margin:auto;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.7);
}

.addLesson-div {
    width: 500px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
}

.close {
    position: absolute;
    top: 0;
    right: 0;
    padding: 10px;
    cursor: pointer;
}
           
           
                .form-group {
            margin-bottom: 20px;
        }

        label {
            display: block;
            font-weight: bold;
            color: #555; /* 设置标签颜色 */
        }

        input[type="text"] {
            width: 100%;
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

        button {
            background-color: #007bff; /* 设置按钮背景颜色 */
            color: #fff;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
    </style>
<div class="header" th:insert="~{common/kuangjia::header}"></div>
<div class="diceng">
<div class="caidan">
<ul>
<li><a th:href="@{/manong//managermain}">首页</a></li>
<li><a th:href="@{/manong/getAllCourse}">选课系统</a></li>
<li><a th:href="@{/manong/gradeManager}">成绩管理</a></li>
<li><a th:href="@{/manong/active}">活动公告</a></li>
<li><a th:href="@{/manong/message}">消息中心</a></li>
<li><a th:href="@{/manong/exit}">退出登录</a></li>
</ul>
</div>
<div class="main">

  <div>  
        <button id="addBtn" class="addBtn">添加课程</button>
    <div id="addDiv" class="addLesson">
    <div class="addLesson-div">
            <span class="close" id="closeModalBtn">&times;</span>
            <div th:insert="~{web-pages/lesson-add::add-lesson}"></div>
        </div>
    </div>
    </div>
     <script type="text/javascript" th:inline="javascript">
    
 // modal.js
    document.addEventListener("DOMContentLoaded", function() {
        var addDiv = document.getElementById("addDiv");
        var addBtn = document.getElementById("addBtn");
        var closeBtn = document.getElementById("closeModalBtn");
        var updateDiv = document.getElementById("updateDiv");
        var updateBtn = document.getElementById("updateBtn");
        var closeUpdateBtn = document.getElementById("closeUpdateBtn");
       
        addBtn.addEventListener("click", function() {
            addDiv.style.display = "block";
        });

        closeBtn.addEventListener("click", function() {
            addDiv.style.display = "none";
        });
        updateBtn.addEventListener("click", function() {
        	updateDiv.style.display = "block";
        });

        closeUpdateBtn.addEventListener("click", function() {
            updateDiv.style.display = "none";
        });
    });
</script>
    
    <hr>
    <table>
        <tr>
            <th>课程号</th>
            <th>课程</th>
            <th>授课教师</th>
            <th>年级</th>
            <th>上课时间</th>
            <th>教室</th>
            <th>星期</th>
            <th>专业</th>
            <th>学分</th>
            <th>操作</th>
        </tr>
        <tr th:each="u:${list}">
            <td th:text="${u.cno}"></td>
            <td th:text="${u.course}"></td>
            <td th:text="${u.teacher}"></td>
            <td th:text="${u.year}"></td>
            <td th:text="${u.jieci}"></td>
            <td th:text="${u.classroom}"></td>
            <td th:text="${u.week}"></td>
            <td th:text="${u.speciality}"></td>
            <td th:text="${u.credit}"></td>
            <td>
               <a th:href="@{/manong/update(cno=${u.cno})}">修改</a>
                <a th:href="@{/manong/deleteLesson(cno=${u.cno})}" onclick="return confirm('确定要删除吗')">删除</a>
            </td>
        </tr>
    </table>
    </div>
    </div>
    
</body>
</html>
